<!--
 * @Author: 刘十三
 * @Date: 2024-01-04 15:52:40
 * @LastEditors: 刘十三
 * @LastEditTime: 2024-02-04 19:35:10
 * @FilePath: \NM-dev-1.3.1\dev\pages\internal\linkage\components\retailerList.vue
 * @Description: 内蒙多员联动 - 信息录入（选择零售许可证号列表）此组件目前只适用于 内蒙多员
-->

<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :is-white="false" :title="navTitle" :custom-back="goBack" style="z-index: 99999">
      <view class="nav-right-icon">
        <view @tap="handlerSure">
          确定
        </view>
      </view>
    </theme-navbar>
    <!-- #endif -->
    <!-- #ifdef H5-WECHAT -->
    <fab-button :content="fContent" @fabtrigger="fabtrigger" />
    <!-- #endif -->
    <view>
      <u-search class="search-space" shape="round" :clearabled="true" :showAction="true" actionText="确定" :animation="true" placeholder="请输入企业字号、许可证号、地址" v-model="searchData.queryStr" @custom="handlerSearch"></u-search>
      <u-dropdown class="u-dropdown u-p-l-20 u-p-r-20" ref="searchDropDown" @open="handlerOpen" @close="handlerClose">
        <u-dropdown-item :title="curOrgName" :options="[]" v-model="searchData.orgId" @change="handlerChangeItem" style="flex:none"></u-dropdown-item>
        <u-dropdown-item title="许可证状态" @change="handleChangeList">
          <view class="slot-ts">
            <u-cell-group :border="false">
              <u-cell-item :title="ix.bcbName" :arrow="false" v-for="ix in licNoList" :key="ix.bcbId" @click="selectTaskSubject(ix)">
                <u-icon v-if="ix.checked" slot="right-icon" size="40" :color="$theme.u_type_primary" name="checkbox-mark"></u-icon>
              </u-cell-item>
            </u-cell-group>
          </view>
        </u-dropdown-item>
      </u-dropdown>
      <u-gap class="u-gap-sty" :height="$theme.cm_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
    </view>
    <view class="content u-page u-p-t-30">
      <mescroll-list :i="0" :index="0" :height="getListViewHeight()" :load-data="loadData" :initLoad="false" ref="mescrollItem0">
        <view slot-scope="d">
          <u-row style="border-bottom: 1px solid #e5e5e5; padding: 5px 0px;" @tap="handlerSelectItem(d.data)">
            <u-col span="10.5">
              <client-item :client="d.data"></client-item>
            </u-col>
            <u-col span="1.5" style="text-align:right;">
              <u-icon name="checkbox-mark" :color="$theme.u_type_primary" size="38" style="margin-right: 10px;" v-if="selectedUids.includes(d.data.licNo)"></u-icon>
            </u-col>
          </u-row>
        </view>
      </mescroll-list>
    </view>

    <!-- 组织机构选择 -->
    <u-popup mode="bottom" height="80%" v-model="orgSelectShow" @close="handlerCloseOrg">
      <org-select :cleanParentOrg="true" @choose="handlerChooseOrg" :isHybrid="true" limitNodeType="03"></org-select>
    </u-popup>
  </view>
</template>

<script>
import MescrollList from "@/components/mescroll_list.vue";
import MescrollMoreMixin from "@/components/mescroll-uni/mixins/mescroll-more.js";
import orgSelect from "./orgInfoSelect.vue";
import linkageService from "@/service/internal/linkeage.service";
import ClientItem from "./retailerItem.vue";
import fabButton from "@/components/uni-fab.vue";
export default {
  components: {
    MescrollList,
    ClientItem,
    orgSelect,
    fabButton,
  },
  mixins: [MescrollMoreMixin],
  data() {
    return {
      licNoList: [],
      queryStr: "",
      orgSelectShow: false,
      selectedUids: [], // 选中项的ids
      selectedItems: [], // 选中项
      searchData: {
        // 查询参数
        queryStr: "", // 模糊搜索关键字
        orgId: "", // 组织
        licStatus: "10", // 营业状态
      },
      isSingle: false, // 是否单选，默认多选
      curOrgName: "组织机构",
      fContent: [
        {
          iconPath: require("@/static/confirm.png"),
          selectedIconPath: require("@/static/confirm.png"),
          text: "确定",
          active: false,
        },
      ],
    };
  },
  onLoad(opt) {
    console.log("🚀 ~ onLoad ~ opt:", opt)
    // 是否单选
    console.log(this.curUser.user);
    let provOrgName = undefined;
    let provOrgUuid = undefined;
    if(this.curUser.deptName.includes("送货部") && opt.page === "informationEntryAddUpdate") {
      provOrgName = this.curUser.provOrgName;
      provOrgUuid = this.curUser.provOrgUuid;
    }
    this.searchData.orgId = provOrgUuid || this.curUser.user.org.parentOrgUuid || this.curUser.user.org.orgUuid;
    this.curOrgName = provOrgName || this.curUser.user.org.parentOrgName || this.curUser.user.org.orgName;
  },
  mounted() {
    this.getLicNolist();
  },
  methods: {
    getLicNolist() {
      let array = this.$u.dic.getByDictCode("L_LIC_STATUS") || [];
      let list = array.map((item) => {
        return {
          ...item,
          checked: item.bcbCode == "10" ? true : false,
        };
      });
      this.licNoList = list;
    },
    handleChangeList() {
      if (this.licNoList.length == 0) {
        this.getLicNolist();
      }
    },
    setRightBtns() {
      // 设置右侧标题
      // #ifdef H5-DINGDING
      // 先放开右侧标题
      this.$deviceApi.setRight(
        "确定",
        () => {
          // 添加日计划操作
          this.handlerSure();
          this.setRightBtns();
        },
        true,
        true
      );
      // #endif
    },
    fabtrigger(btn) {
      if (btn.index == 0) {
        this.handlerSure();
      }
    },
    selectTaskSubject(ix) {
      for (let i in this.licNoList) {
        this.licNoList[i].checked = false;
        if (ix.bcbId == this.licNoList[i].bcbId) {
          this.licNoList[i].checked = true;
          this.searchData.licStatus = this.licNoList[i].bcbCode;
        }
      }
      this.$refs.searchDropDown.close();
      this.handlerSearch();
    },
    getListViewHeight() {
      let p = this.$u.sys().windowHeight - 44 - uni.upx2px(90) - this.$u.sys().statusBarHeight + "px";
      // #ifdef H5-DINGDING || H5-WECHAT
      p = this.$u.sys().windowHeight - uni.upx2px(90) - this.$u.sys().statusBarHeight + "px";
      // #endif
      return p;
    },
    handlerSearch() {
      let mescroll = this.getMescroll(0);
      mescroll && mescroll.triggerDownScroll();
    },
    // 选中
    handlerSelectItem(item) {
      this.selectedUids = [item.licNo];
      this.selectedItems = item;
    },
    handlerOpen(idx) {
      // 组织机构 0
      idx == 0 && (this.orgSelectShow = true);
      this.$refs.searchDropDown.highlight();
    },
    handlerClose(idx) {
      this.orgSelectShow = false;
      this.$refs.searchDropDown.highlight(idx);
    },
    handlerChooseOrg(orgs) {
      if (orgs.length == 0) {
        this.$u.toast("请选择组织机构");
        return;
      }
      this.searchData.orgId = orgs[0].id;
      this.curOrgName = orgs[0].name;
      this.$refs.searchDropDown.close();
      this.handlerSearch();
    },
    handlerCloseOrg() {
      this.$refs.searchDropDown.close();
    },
    // 选择搜索条件项
    handlerChangeItem() {
      this.handlerSearch();
    },
    // 列表查询数据
    loadData(page) {
      return new Promise((resolve, reject) => {
        let param = {
          page: page.num,
          limit: page.size,
          paras: {
            ...this.searchData,
          },
        };
        linkageService
          .getLicPage(param)
          .then((res) => {
            if (res.success) {
              resolve({
                data: res.data,
                totalCount: res.count,
              });
            } else {
              this.$u.toast(res.msg);
              resolve({
                data: [],
                totalCount: 0,
              });
            }
          })
          .catch((e) => {
            resolve({
              data: [],
              totalCount: 0,
            });
          });
      });
    },
    // 确定
    handlerSure() {
      if (!this.$u.test.isEmpty(this.selectedItems)) {
        // 选择关联经营户
        this.backPrev({
          paramKey: "retailerSelectBack",
          param: this.selectedItems,
        });
        this.selectedUids = this.selectedItems = [];
      } else {
        this.$u.toast("请选择零售户");
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.page {
  padding: 0;
}

.slot-content {
  background-color: #ffffff;
  padding: 32rpx 32rpx;

  .item-box {
    margin-bottom: 32rpx;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
/deep/.u-dropdown__menu .u-dropdown__menu__item:first-child {
  flex: 1;
}
/deep/.u-dropdown__menu .u-dropdown__menu__item:last-child {
  flex: none;
  padding: 0px 10px;
}
/deep/.u-dropdown__menu .u-dropdown__menu__item:first-child .u-flex {
  overflow: hidden;
  height: 100%;
}

.txt-sty {
  line-height: 60rpx;
  padding: 0 10px;
}

.search-space {
  padding: $cm-search-padding-row $cm-search-padding-column;
  padding-bottom: 6px;
}

.u-gap-sty {
  position: relative;
}

.good-popup-lay {
  padding: $cm-content-paddng-row;
  width: 100%;
  height: 100%;

  &__title {
    font-size: 36rpx;
    font-weight: 600;
    color: $u-main-color;
    margin: 10rpx 0;
    text-align: center;
    width: 100%;
  }

  &__btns {
    width: 100%;
    margin-top: 24rpx;
    display: flex;
    flex-direction: row;
    justify-content: space-between;

    uni-button {
      flex: 0.28;
    }
  }
}
</style>
